<template>
  <f7-page>
    <f7-navbar title="添加房间" back-link="Back"></f7-navbar>
    <f7-list inline-labels no-hairlines-md>
      <f7-list-input label="房号" type="text" placeholder="Your number" :value="number"
        @input="number = $event.target.value" clear-button></f7-list-input>
      <f7-list-input label="房型" type="select" defaultValue="Male" :value="type"
        @input="type = $event.target.value" >
        <option :value="type.type" v-for="(type, index) in object" :key="index">{{type.type}}</option>
      </f7-list-input>
    </f7-list>
    <f7-button fill raised @click="queding">确定添加</f7-button>
  </f7-page>
</template>
<script>
import axios from "axios";
import qs from "qs";
export default {
   data() {
    return {
     type:"",
     number:"",
     object:[]
    };
  },
  mounted() {
    this.selectRoomType();

  },
  methods: {
    queding() {
      const self = this;
      const app = self.$f7;
      URL="/caofuying/RoomNumber/insertRoomNumber";
      axios.post(URL, qs.stringify({
          Number:this.number,
          type:this.type
      })).then(r => {
        const { data } = r;
         if (data == 1) {
           app.dialog.alert(`添加成功`, () => {
        this.$f7router.back("/theroomlist/");
      });
        } else if (data == 0) {
          app.dialog.alert("添加失败");
        } else {
          app.dialog.alert("服务器错误");
        }
      });
      
    },
    selectRoomType() {
       const self = this;
      const app = self.$f7;
      URL = "/caofuying/Room/selectRoomType";
      axios.get(URL, {}).then(r => {
        const { data } = r;
        if (data != null) {
          this.object = data;
        }else{
          app.dialog.alert("服务器错误")
        }
      });
    },
  }
};
</script>